<template>
	<view class="container">
		<view style="position: absolute; top: 0;  width: 100%; height: 620rpx;background: linear-gradient(#f18f00, #f5a93c, #fce8c9)">
			
		</view>
		
		<view class="">
			<u-tabs :list="list1" :current="vindex" @click="click"></u-tabs>
		</view>
		<!--  -->
		<view v-for="(item,index) in orderList" :key="index" class="ahh" @click="goOrderDetail(item)">
			<view class="" style="width: 100%;display: flex;justify-content: space-between;align-items: center;">
				<view class="" style="font-size: 40rpx;font-weight: 900;">
					{{item.store.store_name}}
				</view>
				<view v-if="item.status == 0" class="" style="color: orange;">
					待支付
				</view>
				<view v-if="item.status == 1" class="" style="color: orange;">
					已支付
				</view>
				<view v-if="item.status == 2" class="" style="color: orange;">
					待确认
				</view>
				<view v-if="item.status == 3" class="" style="color: orange;">
					待评论
				</view>
				<view v-if="item.status == 6" class="" style="color: orange;">
					已完成
				</view>
			</view>
			<view class="">
				{{item.create_time}}
			</view>
			<view class="" style="width: 100%;display: flex;justify-content: space-between;align-items: center;">
				<view class="" style="width: 80%;display: flex;overflow-x: scroll;">
					<view class="">
						<image style="width: 150rpx;height: 150rpx;border-radius: 50rpx;padding: 10rpx;" :src="item.store.image" mode=""></image>
					</view>
					<!-- <view class="">
						<image style="width: 150rpx;height: 150rpx;border-radius: 50rpx;padding: 10rpx;" src="../../static/toux.jpg" mode=""></image>
					</view>
					<view class="">
						<image style="width: 150rpx;height: 150rpx;border-radius: 50rpx;padding: 10rpx;" src="../../static/toux.jpg" mode=""></image>
					</view> -->
					
				</view>
				<view class="" style="width: 15%;text-align: center;">
					￥{{item.total_price}}
				</view>
				
			</view>
			
		</view>
		
		
		
		
		
		
		
		
		
		<view class="" style="width: 100%;height: 100rpx;">
			
		</view>
	</view>
</template>
<script>
	import login from "@/components/login.vue"
	import {
		mapActions,
		mapGetters
	} from 'vuex';
  	import carList from '@/components/car-list/car-list.vue'
  	export default {
  		components:{
  			carList,
			login
  		},
		computed: {
			...mapGetters(['userInfo'])
		},
  		data() {
  			return {
  				maskTitle:'',
  				carList:[
  					{	
  						shopId: 1,
  						title: "",
  						total: 2,
  						selected:true,
  						
  					}
  				],
				list1:[{
                    name: '待支付',
                }, 
				{
				    name: '待配送',
				},
				 {
				     name: '待确认',
				 }, 
				{
				    name: '待评论',
				}, 
				{
				    name: '已完成',
				}, 
				],
				lists:[],
				status:'',
				currents:'',
				orderList:[],	
				names:'',
				vindex:'',
  			}
  		},
  		onLoad(option) {
			console.log(option,'查看option是什么')
			if(option.status == 0){
				this.currents = option.status
				this.vindex = option.status
			}else if(option.status == 1){
				this.currents = 2
				this.vindex = 2
			}else if(option.status == 4){
				this.currents = 1
				this.vindex = 1
			}else if(option.status == 5){
				this.currents = 3
				this.vindex = 3
			}else if(option.status == 6){
				this.currents = 6
				this.vindex = 4
			}
			
			
  	// 		this.getFenList()
			this.getOrderList()
  		},
		
  		methods: {
			click(item,index) {
				// if (item.name === '全部') {
				// this.status = ''
				// this.getOrderList()
			 //  } else {
				this.currents = item.index
				this.getOrderList()
			  // }
			},
			// 获取分类列表
			getFenList(){
				this.$req('GET',this.$api.fenLlist,{}).then(res =>{
					console.log(res,'查看分类列表')
					this.lists = res.data.list.map(item => ({ name: item.title }));
				})
			},
			// 获取订单列表
			getOrderList(){
				this.$req('GET',this.$api.getorderList,{
					status:this.currents,
					user_id:uni.getStorageSync('userId')
				}).then(res =>{
					
					this.orderList = res.data.data
					console.log(this.orderList,'获取订单列表this.orderList')
					
				})
			},
			goOrderDetail(item){
				
				this.names = item.store.store_name
				
				// console.log(this.names,'查看item打印的是什么')
				
				uni.navigateTo({
					url: `/order-pkg/order/order?id=${item.id}&name=${this.names}`
				})
			}
				
		}
			
  	}
  </script>
  <style lang="scss">
		page {
			background: #f6f5f7;
		}
  	   
  	    .container {
  	        height: 100%;
  	        display: flex;
  	        flex-direction: column;
  	        align-items: center;
  	        justify-content: space-between;
  	        box-sizing: border-box;
  	        background: #f5f5f5;
  	        overflow: hidden;
  	    }
  	  
		.ahh{
			width: 95%;
			background-color: #fff;
			z-index: 99;
			margin-top: 40rpx;
			border-radius: 10rpx;
			padding: 10rpx;
		}
	  
	  
  </style>